<template>
  <div>
    <equipmentdata/>
    <tablecomponent :tabledata='json'/>
    <div ref="myLine" style="width: 600px;height:400px;"></div>
  </div>
</template>
<script>
import equipmentdata from './equipmentdata'
import tablecomponent from './tablecomponent'
let echarts = require("echarts/lib/echarts");
export default {
  name: "Gauge",
  props: ["chartData"],
  components:{equipmentdata,tablecomponent}
  ,mounted() {
    this.drawLine();
  },
  data(){
    return {
     json : [{ name: "a", id: 1,ok:'23' }, { name: "b", id: 2,ok:"sdg" }]
    }
  },
  methods: {
    drawLine() {
      let dom = this.$refs.myLine;
      let myLine = echarts.init(dom);
      myLine.setOption({
            tooltip : {
        formatter: "{a} <br/>{b} : {c}%"
    },
    series: [
        {
            name: 'null',
            type: 'gauge',
            detail: {formatter:'{value}%'},
            data: [{value: null//chardara
            , name: '完成率'}],
             title : {
                textStyle: {       // 其余属性默认使用全局文本样式，详见TEXTSTYLE
                    fontWeight: 'bolder',
                    fontSize: 20,
                    color: '#fff',
                    shadowColor : '#fff', //默认透明
                    shadowBlur: 10
                }
            },
        }
    ]
      });
    }
  }
};
</script>